<template>
	<uni-nav-bar :title="workList.title" left-icon="left" @clickLeft="navBack" :fixed="true" statusBar></uni-nav-bar>
	<view class="package_sale" v-if="workList">
		<view>{{workList.title}}</view>
		<!-- <view class="space-between top"> -->
			<view class="top">开启时间：{{workList.starttime}}</view>
			<view class="top">关闭时间：{{workList.endtime?workList.endtime:'--'}}</view>
		<!-- </view> -->
	</view>
	<view class="package_sale space-between" v-if="workList">
		<view>应打卡：{{workList.clock_count}}</view>
		<view>正常打卡：{{workList.clock_nums}}</view>
		<view>异常打卡：{{workList.clock_cha}}</view>
	</view>
	<view class="package_sale" style="padding:0px">
		<view class="space-between list" v-for="item in workList.log" :key="item.id"
			@click="navTo('Sale/checkWork/checkDetail?id='+banID+'&title='+workList.title)">
			<view>{{item.createtime}}</view>
			<view class="center">
				<text>{{item.status_name}}</text>
				<uni-icons type="right" size="20"></uni-icons>
			</view>
		</view>
	</view>
</template>

<script setup lang="ts">
	import { navBack, navTo } from '@/utils/navigator';
	import { ref } from 'vue';
	import { showLoading } from '@/utils/prompt';
	import { getBanClockLog } from '@/gql/earthPushing/checkWork';
	import { toPublish } from '@mqtt';
	import { onLoad } from '@dcloudio/uni-app';
	const banID = ref()
	const workList = ref({})
	onLoad((pearm) => {
		banID.value = Number(pearm.id)
		init()
	})
	function init() {
		showLoading()
		const payload = {
			query: getBanClockLog,
			variables: {
				ban_id: banID.value
			},
		};
		toPublish('ql/staff/getBanClockLog',
			payload,
			(obj : any) => {
				uni.hideLoading();
				const { getBanClockLog } = obj.data;
				workList.value = getBanClockLog
			},
		);
	}
</script>

<style scoped lang="less">
	.top {
		margin-top: 20rpx;
	}

	.list {
		padding: 30rpx;
		box-sizing: border-box;
		border-bottom: 1px solid #eee;
	}
</style>